<!--
Copyright (C) 2005-2024 Giorgio Maone <https://maone.net>

SPDX-License-Identifier: GPL-3.0-or-later
-->

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>NoScript</title>
<meta charset="utf-8">
<link rel="icon" href="/img/noscript-options.png">
<link rel="stylesheet" href="/lib/flextabs.css" />
<link rel="stylesheet" href="options.css" />
<link rel="stylesheet" href="whirlpool.css" />
<link rel="stylesheet" href="ui.css" />
<script src="/nscl/lib/browser-polyfill.js"></script>
<script src="/nscl/common/UA.js"></script>
<script src="/nscl/common/include.js"></script>
<script src="/nscl/common/log.js"></script>
<script src="/nscl/common/locale.js"></script>
<script src="/common/themes.js"></script>
<script src="/lib/flextabs.js"></script>
<script src="/ui/ui.js"></script>
</head>
<body>
<div id="bg"></div>
<div id="noscript-options" class="hidden">
<div id="header">
<div class="title">
<h1>__MSG_OptionsLong__</h1>
<span id="version">&nbsp;</span>
</div>
<a target="_blank" href="https://noscript.net/usage?topic=settings">__MSG_HelpLink__</a>
<div class="buttons">
<div id="import-container">
  <input id="file-import" type="file" name="file-import" tabindex="-1" accept=".txt,.json"/>
<button id="btn-import" accesskey="__MSG_Import_accesskey__">__MSG_Import__</button>
</div>
<button id="btn-export" accesskey="__MSG_Export_accesskey__">__MSG_Export__</button>
<button id="btn-reset" accesskey="__MSG_Reset_accesskey__">__MSG_Reset__</button>
<a class="donate button" href="https://noscript.net/donate" title="__MSG_DonateLong__">__MSG_DonateShort__</a>
</div>
</div>
<div id="main-tabs" class="flextabs">

<h3 class="flextabs__tab"><button class="flextabs__toggle">__MSG_SectionGeneral__</button></h3>
<div class="flextabs__content flextabs__content--active--last">
  <section id="sect-general">
  <div class="opt-group">
    <span id="global-opt">
    <input type="checkbox" id="opt-global"><label for="opt-global" id="lbl-global">__MSG_NoEnforcement__</label>
    </span>
    <span id="enforceOnRestart-opt">
      <input type="checkbox" id="opt-enforceOnRestart"><label for="opt-enforceOnRestart" id="lbl-enforceOnRestart">__MSG_EnforceOnRestart__</label>
    </span>
  </div>
  <div class="opt-group not-tor">
    <label aria-expanded="false"><span>__MSG_behavior_label__</span><button class="modifier" id="current-behavior">__MSG_Custom__</button></label>
  </div>
  <div class="opt-group">
    <span id="auto-opt">
    <input type="checkbox" class="enforcement_required" id="opt-auto"><label for="opt-auto" id="lbl-auto">__MSG_AutoAllowTopLevel__</label>
    </span>
  </div>
  <div class="opt-group">
    <span id="cascadePermissions-opt">
    <input type="checkbox" class="enforcement_required" id="opt-cascadePermissions"><label for="opt-cascadePermissions" id="lbl-cascadePermissions">__MSG_CascadePermissions__</label>
    </span>
  </div>
  <div class="opt-group">
    <span id="cascadeRestrictions-opt">
    <input type="checkbox" class="enforcement_required" id="opt-cascadeRestrictions"><label for="opt-cascadeRestrictions" id="lbl-cascadeRestrictions">__MSG_CascadeRestrictions__</label>
    </span>
  </div>
  </section>
  <section id="sect-presets">
    <fieldset class="enforcement_required">
      <legend>__MSG_CustomizePresets__</legend>
      <div id="presets"></div>
    </fieldset>
  </section>
</div>

<h3 class="flextabs__tab"><button class="flextabs__toggle enforcement_required">__MSG_SectionSitePermissions__</button></h3>
<div class="flextabs__content">
  <section class="sect-sites">
  <form id="form-newsite" class="browser-style" >
  <label id="newsite-label" for="newsite" accesskey="__MSG_WebAddress_accesskey__">__MSG_WebAddress__</label><input name="newsite" id="newsite" type="text" placeholder="[https://]noscript.net"
  ><button class="add">+</button>
  </form>
  <div id="sites">
    <div class="cssload-container">
  	   <div class="cssload-whirlpool"></div>
    </div>
  </div>
  </section>
</div>

<h3 class="flextabs__tab appearance_tab"><button class="flextabs__toggle">__MSG_SectionAppearance__</button></h3>
<div class="flextabs__content appearance_tab">
  <div class="opt-group">
    <span id="showCtxMenuItem-opt">
    <input type="checkbox" id="opt-showCtxMenuItem">
    <label for="opt-showCtxMenuItem" id="lbl-showCtxMenuItem">__MSG_ShowCtxMenuItem__</label>
    </span>
  </div>
  <div class="opt-group">
    <span id="showCountBadge-opt">
    <input type="checkbox" id="opt-showCountBadge">
    <label for="opt-showCountBadge" id="lbl-showCountBadge">__MSG_ShowCountBadge__</label>
    </span>
  </div>
  <div class="opt-group">
    <span id="showFullAddresses-opt">
    <input type="checkbox" id="opt-showFullAddresses">
    <label for="opt-showFullAddresses" id="lbl-showFullAddresses">__MSG_ShowFullAddresses__</label>
    </span>
  </div>
  <div class="opt-group">
    <span id="showProbePlaceholders-opt">
    <input type="checkbox" id="opt-showProbePlaceholders">
    <label for="opt-showProbePlaceholders" id="lbl-showProbePlaceholders">__MSG_showProbePlaceholders__</label>
    </span>
  </div>
  <section id="sect-themes">
  <fieldset id="themes">
    <legend>__MSG_settingsThemeLabel__</legend>
  <div class="opt-group">
    <span id="theme-choice">
     <input id="theme-dark" type="radio" name="theme" value="dark" /><label for="theme-dark">__MSG_themeDark__</label>
     <input id="theme-light" type="radio"  name="theme" value="light"/><label for="theme-light">__MSG_themeLight__</label>
     <input id="theme-auto" type="radio" name="theme" value="auto" checked="checked"/><label for="theme-auto">__MSG_themeAuto__</label>
    </span>
    <span id="vintageTheme-opt" title="__MSG_toVintageBlue__">
      <label for="opt-vintageTheme" title="__MSG_ModernRed__">>__MSG_ModernRed__</label>
          <label class="switch">
            <input type="checkbox" id="opt-vintageTheme">
            <span class="slider round"></span>
            <span class="inner-label">__MSG_toVintageBlue__</span>
          </label>
      <label for="opt-vintageTheme" title="__MSG_VintageBlue__">__MSG_VintageBlue__</label>
    </span>
    <span id="highContrast-opt">
    <input type="checkbox" id="opt-highContrast">
    <label for="opt-highContrast" id="lbl-highContrast">__MSG_HighContrast__</label>
    </span>
  </div>
</fieldset>
</section>
</div>

<h3 class="flextabs__tab"><button class="flextabs__toggle">__MSG_SectionAdvanced__</button></h3>
<div class="flextabs__content">

  <div id="tb-options" class="opt-group">
    <span id="overrideTorBrowserPolicy-opt">
      <input type="checkbox" id="opt-overrideTorBrowserPolicy">
        <label for="opt-overrideTorBrowserPolicy" id="lbl-opt-overrideTorBrowserPolicy"
        ><span class="tor">__MSG_OptOverrideTorBrowserPolicy__</span><span class="not-tor">__MSG_OptIncognitoPerm__</span></label>
    </span>
  </div>

  <div id="xss-options" class="opt-group">
    <span id="xss-opt">
      <input type="checkbox" id="opt-xss">
      <label for="opt-xss" id="lbl-xss">__MSG_OptFilterXGet__
        <span id="xssFaq">(<a href="https://noscript.net/faq#xss" title="https://noscript.net/faq#xss">__MSG_XssFaq__</a>)
      </label>
    </span>
    <div id="xssChoices">
    </div>
    </div>
    <div id="clearclick-options" class="opt-group">
    <input type="checkbox" id="opt-clearclick"><label for="opt-clearclick" id="lbl-clearclick">ClearClick</label>
    </div>

  <div id="update-options" class="opt-group">
    <span id="amnesticUpdates-opt">
      <input type="checkbox" id="opt-amnesticUpdates">
        <label for="opt-amnesticUpdates" id="lbl-opt-amnesticUpdates">__MSG_OptAmnesticUpdates__</label>
    </span>
  </div>

  <section id="sect-TabGuard">
    <fieldset id="TabGuard">
      <legend>__MSG_TabGuard_label__</legend>
    <div class="opt-group">
      <span id="tgMode">
       <input id="tgm-global" type="radio" name="TabGuardMode" value="global" /><label for="tgm-global">__MSG_TabGuard_optEnabled__</label>
       <input id="tgm-incognito" type="radio"  name="TabGuardMode" value="incognito" checked="checked"/><label for="tgm-incognito">__MSG_TabGuard_optIncognito__</label>
       <input id="tgm-off" type="radio" name="TabGuardMode" value="off"/><label for="tgm-off">__MSG_TabGuard_optDisabled__</label>
      </span>
    </div>
    <div class="opt-group">
      <span id="tgPrompt">
       <input id="tgm-never" type="radio" name="TabGuardPrompt" value="never" /><label for="tgm-never">__MSG_TabGuard_optPromptNever__</label>
       <input id="tgm-post" type="radio"  name="TabGuardPrompt" value="post" checked="checked"/><label for="tgm-post">__MSG_TabGuard_optPromptPost__</label>
       <input id="tgm-always" type="radio" name="TabGuardPrompt" value="always"/><label for="tgm-always">__MSG_TabGuard_optPromptAlways__</label>
      </span>
    </div>
    <div id="tgForget" class="opt-group"><button id="tgForgetButton">__MSG_TabGuard_forget__</button></div>
    </fieldset>
  </section>

  <section id="debug" class="browser-style">
  <div class="opt-group">
    <span><input type="checkbox" id="opt-debug"><label id="label-debug" for="opt-debug">Debug</label></span>
  </div>
  </section>
  <div id="debug-tools" class="debug">
    <label for="policy">Policy:</label>
    <div id="policy-error"></div>
    <textarea id="policy" class="browser-style">
    </textarea>
  </div>

</div>
</div>
</div>
<div id="behavior" class="hidden">
  <div class="content">
  <h1 class="onboarding">__MSG_Onboarding_title__</h1>
  <h2>__MSG_behavior_title__</h2>
  <p><span>__MSG_behavior_prompt__</span> <a target="_blank" href="https://noscript.net/usage?topic=behavior">__MSG_LearnMoreLink__</a></p>
  <div class="card">
    <label>
      <input type="radio" name="behavior" value="defaultDeny">
      <h3>__MSG_behavior_defaultDeny_title__</h3>
    </label>
    <label>
       <input type="checkbox" class="reveal">
       <p>__MSG_behavior_defaultDeny_description__</p>
    </label>
  </div>
  <div class="card">
    <label>
      <input type="radio" name="behavior" value="auto">
      <h3>__MSG_behavior_auto_title__</h3>
    </label>
    <label>
       <input type="checkbox" class="reveal">
       <p>__MSG_behavior_auto_description__</p>
    </label>
  </div>
  <div class="card">
    <label>
      <input type="radio" name="behavior" value="defaultAllow">
      <h3>__MSG_behavior_defaultAllow_title__</h3>
    </label>
    <label>
       <input type="checkbox" class="reveal">
       <p>__MSG_behavior_defaultAllow_description__</p>
    </label>
  </div>
  </div>
  <button class="close">__MSG_Close__</button>
</div>
<script src="/nscl/service/persistent-tabs.js"></script>
<script src="options.js"></script>
</body>
</html>
